<template>
  <div>
    <div id="main" style="width: 1000px; height: 400px"></div>
  </div>
</template>

<script>
import { getData } from "../../api";

import _ from "lodash";
export default {
  name: "DataGram",
  data() {
    return {
      options: {
        title: { text: "用户来源" },
        tooltip: {
          trigger: "axis",
          axisPointer: { type: "cross", label: { backgroundColor: "#E9EEF3" } },
        },
        grid: { left: "3%", right: "4%", bottom: "3%", containLabel: true },
        xAxis: [{ boundaryGap: false }],
        yAxis: [{ type: "value" }],
      },
     
    };
  },
  created() {},
  mounted() {
    var myChart = this.$echarts.init(document.getElementById("main"));
    getData().then((res) => {
       
        myChart.setOption( _.merge(res.data.data,this.options));
    });


  
    
  },
};
</script>

<style>
</style>